<template>
  <div class="move-dialog-wrapper">
    <!-- 移动文件-选择目录模态框 -->
    <a-modal title="选择目录" :visible.sync="dialogMoveFile.visible">
      <div class="a-dialog-div">
        <a-tree
            node-key="id"
            :data="dialogMoveFile.fileTree"
            :props="defaultProps"
            :highlight-current="true"
            @node-click="selectNodeClick"
        ></a-tree>
      </div>
      <div slot="footer" class="dialog-footer">
        <a-button @click="$emit('setMoveFileDialogData', null, false)">取 消</a-button>
        <a-button type="primary" @click="$emit('confirmMoveFile')">确 定</a-button>
      </div>
    </a-modal>
  </div>
</template>

<script>
export default {
  name: 'MoveFileDialog',
  props: {
    dialogMoveFile: Object
  },
  data() {
    return {
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    }
  },
  methods: {
    //  移动文件模态框：选择目录事件
    selectNodeClick(data) {
      this.$emit('setSelectFilePath', data.id)
    }
  }
}
</script>

<style  scoped>
@import '~@assets/less/common.less';
/*//@import '~@/assets/styles/mixins.styl'*/

/*.move-dialog-wrapper*/
/*  >>> .a-dialog*/
/*    .a-dialog__header*/
/*      display flex*/

/*    .a-dialog__body*/
/*      padding 10px 30px*/

/*      .a-dialog-div*/
/*        height 300px*/
/*        overflow auto*/
/*        setScrollbar(6px)*/

/*        .a-tree*/
/*          .a-tree-node__content*/
/*            height 34px*/
/*            font-size 16px*/

/*            .a-icon-caret-right*/
/*              font-size 18px*/

/*          .a-tree-node.is-current > .a-tree-node__content*/
/*            color $Primary*/

/*            .a-tree-node__expand-icon*/
/*              color inherit*/
</style>
